 import React, { Component } from 'react'
import { Form, Input, Button, Checkbox } from 'antd'
import { UserOutlined, LockOutlined } from '@ant-design/icons'

import './index.less'

 export default class Login extends Component {
   render() {
     return (
       <div className="site-login">
         <Form
           name="normal_login"
           className="login-form"
           initialValues={{
             remember: true,
           }}
           onFinish={this.onFinish}
         >
           <Form.Item
             name="username"
             rules={[
               {
                 required: true,
                 message: '请输入用户名!',
               },
             ]}
           >
             <Input prefix={<UserOutlined className="site-form-item-icon" />} placeholder="请输入用户名" />
           </Form.Item>
           <Form.Item
             name="password"
             rules={[
               {
                 required: true,
                 message: '请输入密码!',
               },
             ]}
           >
             <Input
               prefix={<LockOutlined className="site-form-item-icon" />}
               type="password"
               placeholder="请输入密码"
             />
           </Form.Item>
           <Form.Item>
             <Form.Item name="remember" valuePropName="checked" noStyle>
               <Checkbox>记住我</Checkbox>
             </Form.Item>

             <a className="login-form-forgot" href="/">
               忘记密码
            </a>
           </Form.Item>

           <Form.Item>
             <Button type="primary" htmlType="submit" className="login-form-button">
               登录
            </Button>
           </Form.Item>
         </Form>
         </div>
     )
   }
 }
 